<template>
  <div class="uifix-search-dialog">
    <el-alert title="需要注意的事项" type="warning" :closable="false">
      <template slot="title">
        <div style="margin-bottom: 10px;">{{ dict.label.standard_process_node[node] }} / {{ dict.label.standard_drawing_discipline[discipline] }}</div>
        <div v-if="type === 2">
          <div>需要注意的事项:</div>
          <div>1、设置为排除项的内容在 工场-项目-模型策划功能 中不可见</div>
          <div>2、设置为排除项的内容在 HUB-项目-评分表 中不可见</div>
        </div>
      </template>
    </el-alert>
    <!--表单组件-->
    <el-form ref="form" :model="form" size="small" label-width="90px" style="margin-top: 30px;">
      <el-row>
        <el-col :span="12">
          <el-form-item label="构件管理" prop="standardComponentGroups">
            <div class="tree">
              <el-tree
                ref="componentTree"
                v-model="form.standardComponentGroups"
                :data="componentOptions"
                :props="defaultPropsComponent"
                :expand-on-click-node="false"
                :default-expand-all="true"
                :default-checked-keys="componentIds"
                node-key="id"
                show-checkbox
                @check="handleComponentCheckChange"
              />
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="图纸管理" prop="standardDrawingGroups">
            <div class="tree">
              <el-tree
                ref="drawingTree"
                v-model="form.standardDrawingGroups"
                :data="drawingOptions"
                :props="defaultPropsDrawing"
                :expand-on-click-node="false"
                :default-expand-all="true"
                :default-checked-keys="drawingIds"
                node-key="id"
                show-checkbox
                @check="handleDrawingCheckChange"
              />
            </div>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="cancel">取消</el-button>
      <el-button :loading="isLoading" type="primary" @click="submit">确认</el-button>
    </div>
  </div>
</template>
<script>

import { queryRelationComponentGroups, queryRelationDrawingGroups, submitExclusionsRequired } from '@/api/modelQuality/nodeManage'
import { setLoading } from '@/utils'

export default {
  dicts: ['standard_process_node', 'standard_drawing_discipline'],
  props: {
    node: {
      type: String,
      required: true
    },
    discipline: {
      type: String,
      required: true
    }
  },
  data() {
    this.setLoading = setLoading.bind(this)
    return {
      type: '',
      isLoading: false, // 按钮加载状态
      form: {
        standardComponentGroups: '',
        standardDrawingGroups: ''
      },
      defaultPropsComponent: {
        children: 'children',
        label: 'name'
      },
      componentIds: [], // 全选
      componentOptions: [], // 构件管理
      defaultPropsDrawing: {
        children: 'children',
        label: 'name'
      },
      drawingIds: [], // 全选
      drawingOptions: [] // 图纸管理
    }
  },
  methods: {
    // 查询构件管理树
    queryRelationComponentGroups(type) {
      this.type = type
      const params = {
        node: this.node,
        standardDiscipline: this.discipline,
        type: type
      }
      queryRelationComponentGroups(params).then((response) => {
        this.componentOptions = response.standardComponentGroupDtoList
        this.componentIds = response.componentIds
        this.form.standardComponentGroups = response.standardComponentGroups
      })
    },
    // 选中构件管理复选框
    handleComponentCheckChange(data, checked, indeterminate) {
      this.componentIds = []
      this.form.standardComponentGroups = checked.checkedNodes
    },
    // 查询图纸管理
    queryRelationDrawingGroups(type) {
      const params = {
        node: this.node,
        standardDiscipline: this.discipline,
        type: type
      }
      queryRelationDrawingGroups(params).then((response) => {
        this.drawingOptions = response.standardDrawingGroupDtoList
        this.drawingIds = response.drawingIds
        this.form.standardDrawingGroups = response.standardDrawingGroups
      })
    },
    // 选中图纸管理复选框
    handleDrawingCheckChange(data, checked, indeterminate) {
      this.drawingIds = []
      this.form.standardDrawingGroups = checked.checkedNodes
    },
    // 确定
    submit() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.setLoading(true)
          const params = {
            node: this.node,
            standardDiscipline: this.discipline,
            type: this.type,
            standardComponentGroups: this.form.standardComponentGroups,
            standardDrawingGroups: this.form.standardDrawingGroups
          }
          submitExclusionsRequired(params).then(() => {
            this.setLoading(false)
            this.$emit('update:showSet', false)
            this.$emit('init')
          }).catch(() => {
            this.setLoading(false)
          })
        } else {
          this.setLoading(false)
          return false
        }
      })
    },
    // 取消
    cancel() {
      this.$emit('update:showSet', false)
      this.$emit('findList')
    }
  }
}
</script>
<style scoped lang="scss">
  .dialog-footer {
    text-align: right;
    margin-bottom: -18px;
  }
  .tree {
    overflow: auto;
    width: 100%;
    height: 600px;
    background-color: #fff;
  }
  .el-tree {
    min-width: 100%;
    display: inline-block !important;
  }
  .el-tree-node > .el-tree-node__children {
    overflow: visible;
  }
</style>
